<template>
	<view class="receive_Index" v-if="JSON.stringify(receiveQuery) !== '{}'">
		<classVue v-if="query.form == 'course'" :query="receiveQuery.courseInfo"></classVue>
		<couponVue v-else-if="query.form == 'coupon'" :query="receiveQuery.couponInfo" @toggle="toggle"></couponVue>
		<memberVue v-else-if="query.form == 'card'" :query="receiveQuery.cardInfo"></memberVue>
		<coachVue v-else-if="query.form == 'classes'" :query="receiveQuery.classesInfo"></coachVue>
		<!-- <view :class="status?'btn2':'btn1'" @click="changeSTATUS">
			{{status?'领取成功，去卡包查看':'立即领取'}}
		</view> -->
		<view class="btn1" @click.stop="changeSTATUS">
			{{query.form == 'classes'?'确认上课':'立即领取'}}
		</view>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	import classVue from './components/class.vue'
	import couponVue from './components/coupon.vue'
	import memberVue from './components/member.vue'
	import coachVue from './components/coach.vue'
	import {
		qrcodeInfo,
		draw,
		coachCancel
	} from '@/api/home.js'
	export default {
		components: {
			classVue,
			couponVue,
			memberVue,
			coachVue
		},
		data() {
			return {
				query: {
					form: '',
					scene: ''
				},
				receiveQuery: {}
			}
		},
		onLoad(e) {
			console.log('e', JSON.parse(e.query));
			this.query = JSON.parse(e.query)
			this.getqrcodeInfo({
				scene: this.query.scene
			})
		},
		onShow() {},
		methods: {
			toggle() {
				this.$set(this.receiveQuery.couponInfo, 'open', !this.receiveQuery.couponInfo.open);
			},
			changeSTATUS() {
				var obj = {
					form: this.query.form
				}
				if (obj.form !== 'classes') {
					if (this.query.form == 'card') {
						obj.order_no = this.receiveQuery.cardInfo.order_no
					} else if (this.query.form == 'coupon') {
						obj.coupon_id = this.receiveQuery.couponInfo.coupon_id
					} else if (this.query.form == 'course') {
						obj.order_no = this.receiveQuery.courseInfo.order_no
					}
					draw(obj).then(({
						data: res
					}) => {
						console.log('res', res);
						if (res.code == 1) {
							this.$refs.uToast.show({
								title: res.msg,
								type: 'success',
								icon: false,
							})
						} else {
							this.$refs.uToast.show({
								title: res.msg,
								type: 'error',
								icon: false,
							})
						}
					})
				} else {
					obj.classes_id = this.receiveQuery.classesInfo.classes_id
					coachCancel(obj).then(({
						data: res
					}) => {
						console.log('res', res);
						if (res.code == 1) {
							this.$refs.uToast.show({
								title: res.msg,
								type: 'success',
								icon: false,
							})
						} else {
							this.$refs.uToast.show({
								title: res.msg,
								type: 'error',
								icon: false,
							})
						}
					})
				}

			},
			getqrcodeInfo(e) {
				qrcodeInfo(e).then(({
					data: res
				}) => {
					if (res.code == 1) {
						this.receiveQuery = res.data
						uni.setNavigationBarTitle({
							title: this.query.form == 'course' ? '领取课程' : this.query.form == 'coupon' ?
								'领取优惠券' : this.query.form == 'card' ? '领取会员卡' : ''
						});
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.receive_Index {
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.btn1 {
		width: 702rpx;
		height: 88rpx;
		background: #73F0EA;
		border-radius: 16rpx;
		font-size: 34rpx;
		font-family: PingFang SC, PingFang SC-Bold;
		font-weight: 700;
		text-align: center;
		color: #ffffff;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.btn2 {
		transform: rotateZ(360deg);
		width: 702rpx;
		height: 88rpx;
		border: 1rpx solid #73F0EA;
		border-radius: 16rpx;
		font-size: 34rpx;
		font-family: PingFang SC, PingFang SC-Bold;
		font-weight: 700;
		text-align: center;
		color: #73F0EA;
		display: flex;
		align-items: center;
		justify-content: center;
	}
</style>